<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2015/8/26 0026
  Time: 下午 2:22
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE HTML>

<html>
<head>
    <title>用户列表</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <%--<link href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">--%>
    <link href="/static/bui/css/bs3/dpl.css" rel="stylesheet" type="text/css"/>
    <link href="/static/bui/css/bs3/bui.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class="doc-content">
    <div class="panel">
        <div class="panel-header">
            <h3>用户信息</h3>
        </div>
        <div class="panel-body">
            <form id="searchForm" class="form-horizontal well" action="/user/find" method="post">
                <div class="row">
                    <div class="control-group span8">
                        <label class="control-label">用户名：</label>

                        <div class="controls">
                            <input type="text" class="control-text" name="username">
                        </div>
                    </div>
                    <div class="control-group span8">
                        <label class="control-label">邮箱：</label>

                        <div class="controls">
                            <input type="text" class="control-text" name="email">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="control-group span8">
                        <label class="control-label">用户状态：</label>

                        <div class="controls">
                            <select name="status">
                                <option value="">请选择</option>
                                <option value="1">正常</option>
                                <option value="0">禁止</option>
                            </select>
                        </div>
                    </div>
                    <div class="control-group span9">
                        <label class="control-label">注册时间：</label>
                        <input type="text" class=" calendar" style="width: 90px" name="startDate">-
                        <input name="endDate" type="text" style="width: 90px" class=" calendar">
                    </div>
                    <div class="span3 offset2">
                        <input value="搜索" type="submit" id="btnSearch" class="button button-primary"/>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="doc-content">
    <div class="row">
        <div class="span21 offset3 control-row-auto">
            <div id="grid"></div>
            <input type="hidden" name="eduation">
        </div>
    </div>
</div>


<div id="content" class="hide">
    <form id="J_Form" class="form-horizontal bui-form-horizontal bui-form bui-form-field-container">
        <div class="row" style="display: none">
            <div class="control-group span8">
                <label class="control-label"><s>*</s>_id：</label>

                <div class="controls">
                    <input name="_id" type="text" id="_id" class="input-normal control-text bui-form-field"
                           aria-disabled="false" aria-pressed="false">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="control-group span8">
                <label class="control-label"><s>*</s>姓名：</label>

                <div class="controls">
                    <input id="username" name="username" type="text" data-rules="{required:true}"
                           class="input-normal control-text bui-form-field" aria-disabled="false" aria-pressed="false">
                </div>
            </div>
        </div>
        <div class="row" style="display: none">
            <div class="control-group span8">
                <label class="control-label"><s>*</s>密码：</label>

                <div class="controls">
                    <input name="password" id="password" type="password" class="input-normal control-text">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="control-group span8">
                <label class="control-label"><s>*</s>邮箱：</label>

                <div class="controls">
                    <input id="email" name="email" type="text"
                           class="input-normal control-text">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="control-group span8">
                <label class="control-label">用户状态：</label>

                <div class="controls">
                    <select id="status" name="status" class="input-normal bui-form-field-select bui-form-field"
                            aria-disabled="false" aria-pressed="false">
                        <option>请选择</option>
                        <option value="1">正常</option>
                        <option value="0">禁止</option>
                    </select>
                </div>
            </div>
        </div>
    </form>
</div>
<script type="text/javascript" src="/static/js/jquery.min.js"></script>
<script type="text/javascript" src="/static/bui/js/bui.js"></script>
<script type="text/javascript" src="/static/bui/js/config.js"></script>
<script type="text/javascript" src="/static/js/cxdate.js"></script>
<script type="text/javascript">
    BUI.use('common/page');
</script>
<script type="text/javascript">
    BUI.use(['bui/grid', 'bui/data', 'bui/form', 'bui/calendar'], function (Grid, Data, Form, Calendar) {
        var columns = [
                    {title: '用户名', dataIndex: 'username', width: '15%'},
                    {title: '邮箱或电话', dataIndex: 'email', width: '35%'},
                    {title: '注册时间', dataIndex: 'registerTime', width: '20%'},
                    {title: '用户状态', dataIndex: 'status', width: '15%'},
                    {
                        title: '操作', width: '40%', renderer: function () {
                        var roleStr = '<span  class="grid-command btn-role"><i class="icon-cog"></i>角色配置</span>',
                                infoStr = '<span  class="grid-command btn-info"><i class="icon-info-sign"></i>详情</span>',
                                editStr = '<span class="grid-command btn-edit"><i class="icon-edit"></i>编辑</span>',
                                rePwd = '<span class="grid-command btn-pwd"><i class="icon-pause"></i>重置密码</span>';
                        return infoStr + editStr + roleStr + rePwd;
                    }
                    }
                ],
        //默认的数据
                data = [
                    <c:forEach items="${users}" var="p">
                    {
                        _id: '${p._id}',
                        username: '${p.username}',
                        password: '${p.password}',
                        email: '${p.email}',
                        registerTime: cxDate("YYYY-MM-DD", '${p.registerTime}'),
                        status: '<c:if test="${p.status==1}">正常</c:if><c:if test="${p.status==0}">禁止</c:if>',
                        role: '${p.role}'
                    },
                    </c:forEach>
                ],
                store = new Data.Store({
                    data: data,
                    pageSize: 20
                }),
                datepicker = new Calendar.DatePicker({
                    trigger: '.calendar',
                    autoRender: true
                });
        editing = new Grid.Plugins.DialogEditing({
            contentId: 'content',
            triggerCls: 'btn-edit',
            editor: {
                focusable: false,
                success: function () {
                    var editType = editing.get('editType'),
                            editor = this,
                            form = editor.get("form");
                    form.valid();
                    if (form.isValid()) {
                        this.close();
                        var _id = $('#_id').val(),
                                username = $('#username').val(),
                                password = $('#password').val(),
                                email = $('#email').val(),
                                status = $('#status').val()
                        if (editType == 'add') {
                            $.ajax({
                                type: 'post',
                                url: '/user/addUser',
                                data: {"username": username, "email": email, "status": status},
                                success: function (msg) {
                                    if (msg == "success") {
                                        msg = "添加成功！";
                                        BUI.Message.Alert(msg, function () {
                                            window.location.href = '/user/list.do';
                                        }, 'success')
                                    } else {
                                        msg = "添加失败！";
                                        BUI.Message.Alert(msg, function () {
                                            window.location.href = '/jsp/error/noAuthority.jsp';
                                        }, 'error')
                                    }

                                }
                            })
                        } else {
                            $.ajax({
                                type: 'post',
                                url: '/user/updateUser',
                                data: {
                                    "_id": _id,
                                    "username": username,
                                    "password": password,
                                    "email": email,
                                    "status": status
                                },
                                success: function (msg) {
                                    if (msg == 'success') {
                                        msg = '修改成功！';
                                        BUI.Message.Alert(msg, function () {
                                            window.location.href = '/user/list.do';
                                        }, 'success')
                                    } else {
                                        msg = '修改失败！';
                                        BUI.Message.Alert(msg, function () {
                                            window.location.href = '/jsp/error/noAuthority.jsp';
                                        }, 'error')
                                    }
                                }
                            })
                        }
                    }
                }
            }
        }),
                grid = new Grid.Grid({
                    render: '#grid',
                    columns: columns,
                    width: '100%',
//                    forceFit: true,
                    plugins: [Grid.Plugins.AutoFit],
                    store: store,
                    bbar: {
                        pagingBar: true,
                        elCls: 'image-pbar'
                    },
                    plugins: [Grid.Plugins.CheckSelection, editing],
                    tbar: {
                        items: [{
                            btnCls: 'button button-small',
                            text: '<i class="icon-plus"></i>添加',
                            listeners: {
                                'click': addFunction
                            }
                        },
                            {
                                btnCls: 'button button-small',
                                text: '<i class="icon-remove"></i>删除',
                                listeners: {
                                    'click': delFunction
                                }
                            },
                            {
                                btnCls: 'button button-small',
                                text: '<i class="icon-plus"></i>导出表格',
                                listeners: {
                                    'click': exportFunction
                                }
                            }]
                    }
                });
        grid.render();

        grid.on('cellclick', function (ev) {
            var record = ev.record,
                    target = $(ev.domTarget);
            if (target.hasClass('btn-info')) {
                window.location.href = '/user/findUser?userId=' + record._id;
            } else if (target.hasClass('btn-role')) {
                window.location.href = '/user/configureRole?userId=' + record._id;
            } else if (target.hasClass('btn-pwd')) {
//                window.location.href = '/user/resetPwd?userId=' + record._id;
                $.ajax({
                    url: '/user/resetPwd?userId=' + record._id,
                    type: 'POST',
                    success: function (msg) {
                        if (msg == 'success') {
                            msg = "重置成功！";
                        }
                        BUI.Message.Alert(msg, function () {
                            window.location.href = '/user/list.do';
                        }, 'success')
                    }
                })
            }
        })

        function exportFunction() {
            window.location.href = "/user/export.do";
        }

        function addFunction() {
            var newData = {};
            editing.add(newData); //添加记录后，直接编辑
        }

        function delFunction() {
            var selections = grid.getSelection();
            delItems(selections);
        }

        function delItems(items) {
            var _ids = [];
            BUI.each(items, function (item) {
                _ids.push(item._id)
            });
            if (_ids.length) {
                BUI.Message.Confirm('确认要删除吗？', function () {
                    $.ajax({
                        type: 'POST',
                        url: '/user/delUser?_ids=' + _ids,
                        success: function (msg) {
                            if (msg == 'success') {
                                msg = "删除成功！";
                            }
                            BUI.Message.Alert(msg, function () {
                                window.location.href = '/user/list.do';
                            }, 'success')
                        }
                    })
                })
            }
        };
        var form = new Form.HForm({
            srcNode: '#J_Form'
        });
    });
</script>

</body>
</body>
</html>
